<template>
  <div class="form-single-fragment" style="position: relative;">
    <el-form :model="ruleForm" ref="ruleForm" label-width="170px" size="mini" label-position="right">
      <el-row :gutter="20" class="form-single-info">
        <el-col :span="20">
          <el-col :span="12">
            <el-form-item label="任务名称">{{ruleForm.taskName}}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="设置截至时间">{{ruleForm.custBirthday}}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="执行人">{{ruleForm.director}}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="参与人">{{ruleForm.listPartner}}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="关联计划">{{ruleForm.unitAttribute}}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="任务状态">{{ruleForm.unitAttribute}}</el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="工作流程">{{ruleForm.unitAttribute}}</el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="工作流程进度">{{ruleForm.flowName}}</el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="任务描述">{{ruleForm.custName}}</el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="任务日志">
              <el-scrollbar style="height:15vh;">
                <el-timeline>
                  <el-timeline-item
                    v-for="(activity, index) in activities"
                    :key="index"
                    :timestamp="activity.createTime">
                    {{activity.userName}}：{{activity.content}}
                  </el-timeline-item>
                </el-timeline>
              </el-scrollbar>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item style="padding: 20px 0;">
              <el-button @click="resetForm">返回</el-button>
            </el-form-item>
          </el-col>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
import { Cluemanagement } from '@/api/commercial.js';
import { Administration } from '@/api/projectAdministration.js';
export default {
  name: 'TasksaddDetail',
  data () {
    return {
      loading: false,
      isShowloading: false,
      fileLists: [],
      acceptStr: '.doc,.docx,.xls,.xlsx,.jpg,.png,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
      tableData: [],
      listUsers: [],
      customerlist: [],
      situation: 1,
      activities: [],
      ruleForm: {
        custName: '',
        unitAttribute: '',
        contacts: '',
        telephone: '',
        custBirthday: '',
        oppoName: '',
        businessType: '',
        oppoSource: '',
        director: '',
        contractAmount: '',
        listPartner: ''
      }
    };
  },
  created () {
  },
  computed: {
  },
  mounted () {
    // if (this.$route.query.clueId) {
    //   this.loadCluedetail()
    // }
    // if (this.$route.query.oppoId) {
    //   this.loadOpportunitiesdetail()
    // }
  },
  methods: {
    /**
     * 任务详情
     */
    loadOpportunitiesdetail () {
      let params = this.$route.query.oppoId
      return new Promise((resolve, reject) => {
        Cluemanagement.detail(this, params).then(res => {
          this.ruleForm = res.data
          this.ruleForm.businessLevel = res.data.businessLevel.toString()
          this.parentId.push(res.data.parentId)
        }).catch(e => {
          reject(e);
        });
      });
    },
    /**
     * 任务日志
     */
    loadTasklogWidgetData () {
      let params = {
        taskId: this.tasksId,
        logType: 2
      };
      return new Promise((resolve, reject) => {
        Administration.tasklog(this, params).then(res => {
          this.activities = res.data
        }).catch(e => {
          reject(e);
        });
      });
    },
    resetForm () {
      this.$router.go(-1)
    }
  }
}
</script>

<style scoped>
h4{margin-bottom: 0;}
.table_container{margin: 10px 0;}
.form-single-info{display: flex;justify-content: center;}
.el-form-info{box-shadow: 0 0 10px rgba(0,0,0,0.05);padding: 20px;}
.el-form-info strong{margin: 0 10px;}
</style>
